<h4>Navigation</h4>

<div class="btn-group btn-group-justified" role="group">
    <div class="btn-group" role="group">
        <button ng-click="reloadData();" class="btn btn-default btn-sm"><i class="fa fa-refresh"></i> Reload all
        </button>
    </div>

    <div class="btn-group" role="group">
        <button class="btn btn-sm btn-default" ng-click="resetData()"><i class="fa fa-recycle"></i> Reset Filters
        </button>
    </div>
</div>
<br/>

<div class="btn-group btn-group-justified" role="group">
    <div class="btn-group" role="group">
        <button class="btn btn-default" ng-class="{'btn-primary': ranking=='top'}"
                ng-click="setRanking('top');importancy.points=2.5;importancy.similar=2.5;importancy.age=2.5;startSearch();">
            Top
        </button>
    </div>
    <div class="btn-group" role="group">
        <button class="btn  btn-default" ng-class="{'btn-primary': ranking=='newest'}"
                ng-click="setRanking('newest');importancy.points=0;importancy.similar=0;importancy.age=5;startSearch();">
            Newest
        </button>
    </div>
    <div class="btn-group" role="group">
        <button class="btn  btn-default" ng-class="{'btn-primary': ranking=='repost'}"
                ng-click="setRanking('repost');importancy.points=1.5;importancy.similar=5;importancy.age=1.5;startSearch();">
            Re-Posted
        </button>
    </div>
    <div class="btn-group" role="group">
        <button class="btn  btn-default" ng-class="{'btn-primary': ranking=='custom'}"
                ng-click="setRanking('custom');collapsed['ranking_custom'] = false;">Custom
        </button>
    </div>
</div>

<div collapse="collapsed['ranking_custom']">
    <div class="form-group">
        <label for="importPoints">Upvotes</label>
        <input id="importPoints" type="range" min="0" max="5" step="0.1" ng-model="importancy.points"
               ng-change="startSearch()" ng-model-onblur/>
    </div>
    <div class="form-group">
        <label for="importSimilar">Similar Articles</label>
        <input id="importSimilar" type="range" min="0" max="5" step="0.1" ng-model="importancy.similar"
               ng-change="startSearch()" ng-model-onblur/>
    </div>
    <div class="form-group">
        <label for="importDate">Article Age</label>
        <input id="importDate" type="range" min="0" max="5" step="0.1" ng-model="importancy.age"
               ng-change="startSearch()" ng-model-onblur/>
    </div>
</div>
<hr/>

<h4>Filter</h4>
<small>Hint: This is a <a href="http://www.solrtutorial.com/solr-query-syntax.html" target="_blank">Solr-Index</a> </small>
<form ng-submit="setQuery(q)" role="form" class="form-horizontal">
    <div class="input-group">
        <input ng-model="q" placeholder="Search for..." class="form-control"/>
                        <span class="input-group-btn"><button class="btn btn-default" type="submit"><span
                                class="glyphicon glyphicon-search"></span></button></span>
    </div>
</form>
<div class="row">
    <div class="col-sm-6">

        <br/>
        <button class="btn btn-default btn-block" datepicker-popup="mediumDate" ng-model="date.from_date"
                is-open="opened[1]"
                min-date="'2014-10-01'" ng-click="open($event,1)" ng-change="setStartDate(date.from_date)"
                datepicker-append-to-body="false"><i
                class="glyphicon glyphicon-calendar"></i> From {{date.from_date | date:'mediumDate' }}
        </button>
    </div>
    <div class="col-sm-6">
        <br/>
        <button class="btn btn-default btn-block" datepicker-popup="mediumDate" ng-model="date.to_date"
                is-open="opened[2]"
                min-date="'2014-10-01'" ng-click="open($event,2)" ng-change="setEndDate(date.to_date)"
                datepicker-append-to-body="false"><i
                class="glyphicon glyphicon-calendar"></i> To {{date.to_date | date:'mediumDate' }}
        </button>

    </div>
</div>
<hr />
    <div class="row">
        <div class="col-lg-12">

            <h4>Sources
                <button class="btn btn-xs story-collapse-button"
                        ng-click="collapsed['sources'] = !collapsed['sources']"><i
                        class=" fa"
                        ng-class="{'fa-angle-double-up': !collapsed['sources'], 'fa-angle-double-down': collapsed['sources']}"></i>
                </button>
            </h4>
        </div>
        <div class="col-lg-12"  collapse="collapsed['sources']">
            <div class="checkbox" ng-repeat="source in sources">
                <label>
                    <input type="checkbox" ng-model="source.checked" ng-change="startSearch()"> {{source.host}}
                </label>
            </div>
        </div>
    </div>
<hr />


<div class="row hidden-sm hidden-xs">
    <div class="col-lg-6 col-md-12 col-sm-6 ">
        <h4>{{getTopTags().length}} Top Tags  <button class="btn btn-xs story-collapse-button"
                              ng-click="collapsed['top_tags'] = !collapsed['top_tags']"><i
                class=" fa"
                ng-class="{'fa-angle-double-up': !collapsed['top_tags'], 'fa-angle-double-down': collapsed['top_tags']}"></i>
        </button></h4>


        <div ng-show="getSelectedTags().length > 0">
            <br/>
                <span ng-repeat="(index,tag) in getSelectedTags()">
                    <button class="btn btn-default" ng-click="removeTag(index)"><i class="fa fa-remove"></i>
                        {{tag}}
                    </button>
                </span>
            <br/>
            <br/>
        </div>

        <div class="row"  collapse="collapsed['top_tags']">
            <div class="col-lg-12">
                <div ng-repeat="tag in getTopTags()">
                    <a href="" ng-click="addTag(tag.key)">{{tag.key}}
                        <small>{{tag.val}}</small>
                    </a>

                    <div class="progress entity-progress">
                        <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0"
                             aria-valuemax="100" style="width: {{tag.perc}}%;">
                            <span class="sr-only">{{tag.perc}}%</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <div class="col-lg-6 col-md-12 col-sm-6">

        <h4>{{getTopEntities().length}} Entities <button class="btn btn-xs story-collapse-button"
                                                         ng-click="collapsed['top_entities'] = !collapsed['top_entities']"><i
                class=" fa"
                ng-class="{'fa-angle-double-up': !collapsed['top_entities'], 'fa-angle-double-down': collapsed['top_entities']}"></i>
        </button></h4>


        <div ng-show="getSelectedEntities().length > 0">
            <br/>
                <span ng-repeat="(index,entity) in getSelectedEntities()">
                    <button class="btn btn-default" ng-click="removeEntity(index)"><i class="fa fa-remove"></i>
                        {{entity}}
                    </button>
                </span>
            <br/>
            <br/>
        </div>

        <div class="row"   collapse="collapsed['top_entities']">
            <div class="col-lg-12">
                <div ng-repeat="entity in getTopEntities()">
                    <a href="" ng-click="addEntity(entity.key)">{{entity.key}}
                        <small>{{entity.val}}</small>
                    </a>

                    <div class="progress entity-progress">
                        <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0"
                             aria-valuemax="100" style="width: {{entity.perc}}%;">
                            <span class="sr-only">{{entity.perc}}%</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
</div>

<hr />
<h4>
    About & Contact
</h4>

<a href="/#/about" target="_blank">About</a><br/>
<a href="http://www.nagrgtr.com" target="_blank">More Information</a>

<br/>
<small>Contact: thomas [at] newscombinator [dot] com</small><br/>
<br />
<a class="twitter-follow-button"
   href="https://twitter.com/HNCombinator"
   data-show-count="false"
   data-lang="en">
    Follow @HNCombinator
</a><small>, thanks.</small>
<br/>
<script>window.twttr = (function (d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0], t = window.twttr || {};
    if (d.getElementById(id))return;
    js = d.createElement(s);
    js.id = id;
    js.src = "https://platform.twitter.com/widgets.js";
    fjs.parentNode.insertBefore(js, fjs);
    t._e = [];
    t.ready = function (f) {
        t._e.push(f);
    };
    return t;
}(document, "script", "twitter-wjs"));</script>
<br />
<small><a ng-href="{{getJsonLink()}}" target="_blank">Btw, JSON anyone?</a></small>

<br/>
<br/>